<!DOCTYPE HTML>

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">
<head>
<title>Kukbuk - Lista przepisów</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css"
	href="../../../css/bootstrap.min.css"
	th:href="@{/css/bootstrap.min.css}" />
<link rel="stylesheet" type="text/css" href="../../../css/custom.css"
	th:href="@{/css/custom.css}" />
</head>

<body>
	<!-- TOP MENU -->
	<div th:substituteby="template :: top-menu"></div>
	<!-- /TOP MENU -->

	<!-- MAIN CONTAINER -->
	<div class="container">

		<div class="row" th:if="${#bools.isTrue(currentCat)}">
			<div class="offset2">
				<div class="row">
					<div class="page-header">
						<h1>
							<span th:text="${currentCat.name}">Desery</span> <a type="button"
								class="btn btn-primary pull-right"
								th:if="${#bools.isTrue(beans.userSession.isAdmin)}"
								th:href="@{'/admin/category/edit/' + ${currentCat.id}}"> <i
								class="icon-pencil icon-white"></i> Edytuj kategorię
							</a>
						</h1>

					</div>
				</div>
			</div>
		</div>

		<div class="row">
			<div class="span2">
				<div class="tabbable tabs-left">
					<ul class="nav nav-tabs">
						<li th:each="cat : ${beans.categoryService.mainCategories}"
							th:class="${beans.categoryService.isCategoryActive(currentCat, cat)}? 'active'">
							<a rel="popover" class="tooltip-please"
							th:attr="data-original-title=${cat.name}, data-content=${cat.description}"
							th:text="${cat.name}" th:href="@{'/recipe/list/' + ${cat.id}}">Desery</a>
						</li>
					</ul>
				</div>
			</div>

			<div class="span10">
				<!-- MESSAGE BOXES -->
				<div class="row" th:include="template :: message-boxes"></div>
				<!-- /MESSAGE BOXES -->

				<div class="row"
					th:if="${#bools.isTrue(categories) and not #lists.isEmpty(categories)}">
					<h2>Podkategorie</h2>
				</div>
				<!-- CATEGORIES -->
				<div class="row" th:substituteby="template :: categories"></div>
				<!-- /CATEGORIES -->


				<div class="row"
					th:if="${(#bools.isFalse(recipes) or #lists.isEmpty(recipes)) and (#bools.isFalse(categories) or #lists.isEmpty(categories))}">
					<h2>Brak przepisów</h2>
				</div>


				<div class="row"
					th:if="${#bools.isTrue(recipes) and not #lists.isEmpty(recipes)}">
					<h2>Przepisy</h2>
				</div>
				<!-- RECIPES -->
				<div class="row" th:substituteby="template :: recipes"></div>
				<!-- /RECIPES -->
			</div>
		</div>
	</div>
	<!-- /MAIN CONTAINER -->

	<!-- ======================================================== -->
	<!-- Scripts at bottom of page means faster loading times. -->
	<!-- Latest jQuery -->
	<script type="text/javascript"
		src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<!-- Bootstrap -->
	<script type="text/javascript" src="../../../js/bootstrap.min.js"
		th:src="@{/js/bootstrap.min.js}"></script>
	<!-- Custom -->
	<script type="text/javascript" src="../../../js/custom.js"
		th:src="@{/js/custom.js}"></script>
</body>
</html>